<template>
	<xn-form-container
		:title="formData.id ? '编辑申请' : '困难职工帮扶申请'"
		:width="1000"
		v-model:open="open"
		:destroy-on-close="true"
		@close="onClose"
	>
		<a-form ref="formRef" :model="formData" :rules="formRules" layout="vertical" :disabled="flag > 0">
			<a-row>
				<a-col :span="12">
					<a-form-item label="申请人姓名：" name="userName">
						<a-input v-model:value="formData.userName" placeholder="请输入申请人姓名" allow-clear />
					</a-form-item>
				</a-col>
				<a-col :span="12" style="padding-left: 10px">
					<a-form-item label="生日：" name="birthday">
						<a-input v-model:value="formData.birthday" placeholder="生日" disabled allow-clear /> </a-form-item
				></a-col>
				<a-col :span="12">
					<a-form-item label="健康情况：" name="health">
						<a-select
							v-model:value="formData.health"
							placeholder="请选择健康情况"
							:options="healthOptions"
						/> </a-form-item
				></a-col>
				<a-col :span="12" style="padding-left: 10px">
					<a-form-item label="身份证号：" name="idCard">
						<a-input
							v-model:value="formData.idCard"
							@blur="getBirthDay"
							placeholder="请输入身份证号"
							allow-clear
						/> </a-form-item
				></a-col>
				<a-col :span="12">
					<a-form-item label="工作单位：" name="workOrg">
						<a-select v-model:value="formData.workOrg" placeholder="请选择工作单位" :options="workOrgOptions" />
					</a-form-item>
				</a-col>
				<a-col :span="12" style="padding-left: 10px">
					<a-form-item label="工作年限：" name="workRange">
						<a-input v-model:value="formData.workRange" placeholder="请输入工作年限" allow-clear /> </a-form-item
				></a-col>
				<a-col :span="12"
					><a-form-item label="工作职务：" name="duites">
						<a-input v-model:value="formData.duites" placeholder="请输入工作职务" allow-clear /> </a-form-item
				></a-col>
				<a-col :span="12" style="padding-left: 10px">
					<a-form-item label="用工类型" name="laberType">
						<a-select v-model:value="formData.laberType" placeholder="请选择用工类型" :options="laberTypeOptions" />
					</a-form-item>
				</a-col>
				<a-col :span="12">
					<a-form-item label="家庭住址：" name="address">
						<a-input v-model:value="formData.address" placeholder="请输入家庭住址" allow-clear />
					</a-form-item>
				</a-col>
				<a-col :span="12" style="padding-left: 10px">
					<a-form-item label="房屋类型：" name="houseType">
						<a-select
							v-model:value="formData.houseType"
							placeholder="请选择房屋类型"
							:options="houseTypeOptions"
						/> </a-form-item
				></a-col>
				<a-col :span="12"
					><a-form-item label="房屋面积：" name="houseArea">
						<a-input v-model:value="formData.houseArea" placeholder="请输入房屋面积" allow-clear /> </a-form-item
				></a-col>
				<a-col :span="12" style="padding-left: 10px"
					><a-form-item label="联系电话：" name="phone">
						<a-input v-model:value="formData.phone" placeholder="请输入联系电话" allow-clear /> </a-form-item
				></a-col>

				<a-col :span="12">
					<a-form-item label="自付金额：" name="selfPay">
						<a-input v-model:value="formData.selfPay" placeholder="请输入自付金额" allow-clear /> </a-form-item
				></a-col>
				<a-col :span="12" style="padding-left: 10px"
					><a-form-item label="本人平均月收入（元/人）：" name="averageIncome">
						<a-input
							v-model:value="formData.averageIncome"
							placeholder="请输入本人平均月收入（元/人）"
							allow-clear
						/> </a-form-item
				></a-col>
				<a-col :span="12">
					<a-form-item label="家庭人口：" name="familyNum">
						<a-input
							v-model:value="formData.familyNum"
							@blur="calAvg"
							placeholder="请输入家庭人口"
							allow-clear
						/> </a-form-item
				></a-col>

				<a-col :span="12" style="padding-left: 10px">
					<a-form-item label="家庭总收入（元）：" name="totalIncome">
						<a-input
							v-model:value="formData.totalIncome"
							@blur="calAvg"
							placeholder="请输入家庭总收入（元）"
							allow-clear
						/> </a-form-item
				></a-col>
				<a-col :span="12">
					<a-form-item label="家庭平均收入：" name="familyAverageIncome">
						<a-input
							v-model:value="formData.familyAverageIncome"
							placeholder="请输入家庭平均收入"
							disabled
							allow-clear
						/> </a-form-item
				></a-col>
				<a-col :span="24">
					<a-form-item label="致困原因：" name="helpConten">
						<a-textarea v-model:value="formData.helpConten" placeholder="请输入致困原因" allow-clear />
					</a-form-item>
				</a-col>
			</a-row>
			<a-row> </a-row>
			<!--添加困难家庭信息 -->
			<a-divider>家庭成员信息</a-divider>
			<family-table
				ref="familyTableRef"
				:dataSource="formData.bizHelpFamilyList"
				@getData="getFamilyData"
				:flag="flag"
			></family-table>
			<a-divider>上传附件</a-divider>
			<a-form-item label="上传议案文件" name="motionFileId">
				<a-alert message="请将您的申请文件打包为压缩文件上传" type="success" show-icon />
				<br />
				<div>
					<a-upload
						list-type="picture"
						v-model:file-list="fileList"
						accept=".rar, .tar, .zip"
						:remove="handleRemove"
						:before-upload="beforeUpload"
						class="upload-list-inline"
					>
						<a-button>
							<upload-outlined></upload-outlined>
							选择上传附件
						</a-button>
					</a-upload>
				</div>
			</a-form-item>
		</a-form>
		<a-form ref="auditformRef" :model="formData" :rules="auditRules" layout="vertical">
			<template v-if="flag > 0">
				//审批意见
				<a-col :span="24">
					<a-form-item label="所在单位工会调查摸底情况：" name="searchContent">
						<a-textarea v-model:value="formData.searchContent" placeholder="请输入致困原因" allow-clear />
					</a-form-item>
				</a-col>
				<a-col :span="24">
					<a-form-item label="所在单位党组织意见" name="partyOpinion">
						<a-textarea v-model:value="formData.partyOpinion" placeholder="请输入所在单位党组织意见" allow-clear />
					</a-form-item>
				</a-col>
				<a-col :span="24">
					<a-form-item label="集团公司工会意见" name="unionOpinion">
						<a-textarea v-model:value="formData.unionOpinion" placeholder="请输入集团公司工会意见" allow-clear />
					</a-form-item>
				</a-col>
				<a-col :span="24">
					<a-form-item label="审核结果" name="status">
						<a-radio-group v-model:value="formData.status" :options="statusOptions"> </a-radio-group>
					</a-form-item>
				</a-col>
			</template>
		</a-form>

		<template #footer>
			<a-button style="margin-right: 8px" @click="onClose">关闭</a-button>
			<a-button type="primary" @click="onSubmit" :loading="submitLoading">保存</a-button>
		</template>
	</xn-form-container>
</template>

<script setup name="bizHelpForm">
	import dayjs from 'dayjs'
	import tool from '@/utils/tool'
	import { cloneDeep } from 'lodash-es'
	import { required } from '@/utils/formRules'
	import bizHelpApi from '@/api/biz/bizHelpApi'

	import fileApi from '@/api/biz/bizFileManagerApi.js'

	const familyTableRef = ref()

	// 抽屉状态
	const open = ref(false)
	const emit = defineEmits({ successful: null })
	const formRef = ref()
	const auditformRef = ref()
	// 表单数据
	const formData = ref({})
	const submitLoading = ref(false)
	const healthOptions = ref([])
	const workOrgOptions = ref([])
	const houseTypeOptions = ref([])
	const laberTypeOptions = ref([])
	// 上传文件数据
	const fileList = ref([])
	const flag = ref(0)
	import FamilyTable from './component/family-table.vue'

	const familyList = ref([])
	const getFamilyData = (data) => {
		familyList.value = data
	}
	const statusOptions = [
		{
			label: '通过',
			value: 2
		},
		{
			label: '退回',
			value: 0
		}
	]
	const calAvg = () => {
		if (formData.value.familyNum) {
			let avg = (formData.value.totalIncome / formData.value.familyNum).toFixed(2)
			formData.value.familyAverageIncome = avg
		}
	}
	// 默认要校验的
	const formRules = {
		userName: [required('请输入申请人姓名')],
		birthday: [required('请输入生日')],
		laberType: [required('请输入用工类型')],
		maritasStatus: [required('请输入婚姻状况')],
		health: [required('请输入健康情况')],
		idCard: [required('请输入身份证号')],
		workRange: [required('请输入工作年限')],
		workOrg: [required('请输入工作单位')],
		address: [required('请输入家庭住址')],
		houseType: [required('请输入房屋类型')],
		houseArea: [required('请输入房屋面积')],
		phone: [required('请输入联系电话')],
		duites: [required('请输入工作职务')],
		selfPay: [required('请输入自付金额')],
		familyNum: [required('请输入家庭人口')],
		averageIncome: [required('请输入本人平均月收入（元/人）')],
		totalIncome: [required('请输入家庭总收入（元）')],
		familyAverageIncome: [required('请输入家庭平均收入')]
	}
	const auditRules = {
		searchContent: [required('请输入所在单位工会调查摸底情况')],
		partyOpinion: [required('请输入所在单位党组织意见')],
		unionOpinion: [required('请输入集团公司工会意见')],
		status: [required('审批状态')]
	}
	// 打开抽屉
	const onOpen = (record, f) => {
		open.value = true
		healthOptions.value = tool.dictList('健康情况')
		workOrgOptions.value = tool.dictList('WORK_ORG')
		houseTypeOptions.value = tool.dictList('房屋类型')
		laberTypeOptions.value = tool.dictList('LABER_TYPE')

		formData.value.bizHelpFamilyList = []
		flag.value = f
		// flag ==1 审核
		// flag ==2 查看

		if (record) {
			let recordData = cloneDeep(record)
			bizHelpApi.bizHelpDetail(record).then((res) => {
				formData.value = Object.assign({}, res)
				if (f == 1) {
					formData.value.status = 2
				}
				console.log(formData)
			})
		}
	}
	// 关闭抽屉
	const onClose = () => {
		formRef.value.resetFields()
		fileList.value = []
		if (auditformRef.value) {
			auditformRef.value.resetFields()
		}

		formData.value = {}
		open.value = false
	}

	// 根据身份证号获取生日
	const getBirthdayFromIdCard = (idCard) => {
		if (idCard && idCard.length === 18) {
			var year = idCard.substring(6, 10)
			var month = idCard.substring(10, 12)
			var day = idCard.substring(12, 14)
			return year + '-' + month + '-' + day
		}
		return null
	}

	const getBirthDay = () => {
		let date = getBirthdayFromIdCard(formData.value.idCard)
		formData.value.birthday = dayjs(date).format('YYYY-MM-DD HH:mm:ss')
	}

	// 验证并提交数据
	const onSubmit = async () => {
		let res = await uploadFile()
		console.log(res)
		console.log(flag.value)
		if (flag.value == 0) {
			formRef.value
				.validate()
				.then(() => {
					submitLoading.value = true
					const formDataParam = cloneDeep(formData.value)
					formDataParam.bizHelpFamilyList = familyTableRef.value.getData()
					formDataParam.fileList = res
					bizHelpApi
						.bizHelpSubmitForm(formDataParam, formDataParam.id)
						.then(() => {
							onClose()
							emit('successful')
						})
						.finally(() => {
							submitLoading.value = false
						})
				})
				.catch(() => {})
		} else {
			// 提交审核
			auditformRef.value
				.validate()
				.then(() => {
					submitLoading.value = true
					const formDataParam = cloneDeep(formData.value)
					formDataParam.fileList = res
					bizHelpApi
						.applyBizHelp(formDataParam)
						.then(() => {
							onClose()
							emit('successful')
						})
						.finally(() => {
							submitLoading.value = false
						})
				})
				.catch(() => {})
		}
	}

	// 文件处理（等选择后手动上传）
	const handleRemove = (file) => {
		const index = fileList.value.indexOf(file)
		const newFileList = fileList.value.slice()
		newFileList.splice(index, 1)
		fileList.value = newFileList
		console.log(newFileList)
	}

	const beforeUpload = (file) => {
		fileList.value = [...fileList.value, file]
		return false
	}

	// 文件上传
	const uploadFile = async () => {
		const formData = new FormData()
		fileList.value.forEach((file) => {
			file = toRaw(file)
			formData.append('files', file.originFileObj)
		})
		return fileApi.fileUploadLocalReturnIdList(formData)
	}

	// 抛出函数
	defineExpose({
		onOpen
	})
</script>
